<?php
session_start();

if (isset($_POST['username'])) {
	$_SESSION['username'] = $_POST['username'];
	$_SESSION['jenis-kelamin'] = $_POST['jenis-kelamin'];
	$_SESSION['umur'] = $_POST['umur'];
	header("Location: index.php");
	die();
}

if (isset($_SESSION['username'])) {
	header("Location: index.php");
	die();
}
?>

<!-- HTML -->
<!DOCTYPE html>
<html class="js flexbox canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <!-- Meta information -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <!-- Title-->
    <title>QAS Al Qur'an Bahasa Indonesia</title>    
    <!-- Favicons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://stage.account.liektoyota.com/assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://stage.account.liektoyota.com/assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="http://stage.account.liektoyota.com/assets/ico/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="http://stage.account.liektoyota.com/assets/ico/favicon.ico">
    <!-- CSS Stylesheet-->
    <link href="assets/css/login/bootstrap.css" media="screen" rel="stylesheet" type="text/css">
    <link href="assets/css/login/bootstrap-themes.css" media="screen" rel="stylesheet" type="text/css">
    <link href="assets/css/login/style.css" media="screen" rel="stylesheet" type="text/css">
    <link href="assets/css/login/font-awesome.min.css" media="screen" rel="stylesheet" type="text/css">
    <style type="text/css">
        #wrapper {
            background: url('assets/css/login/wallpapers/<?php echo rand(1, 5) ?>.jpg') no-repeat center top fixed;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
        }

        #main {
            background-color: rgba(0,0,0,0.5);
        }

        .site-logo {
            background: url('/assets/css/login/img/logo.png?') no-repeat center center;
            display: block;
            background-size: 300px;
            height: 75px;
            position: relative;
        }

        #username{
            text-transform: uppercase;
        }

        #username::-webkit-input-placeholder{
            text-transform: none;
        }
        #username::-moz-placeholder{
            text-transform: none;
        }

        .clearfix a,
        .clearfix label {
            color: #fff;
            font-weight: bold;
        }

        .clearfix a:hover {
            text-decoration: underline;
        }

    </style>
    <style type="text/css">
        .jqstooltip { 
            position: absolute;
            left: 0px;
            top: 0px;
            visibility: hidden;
            background: rgb(0, 0, 0) transparent;
            background-color: rgba(0,0,0,0.6);
            filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
            color: white;
            font: 10px arial, san serif;
            text-align: left;
            white-space: nowrap;
            padding: 5px;
            z-index: 10000;
        }
        .jqsfield { 
            color: white;
            font: 10px arial, san serif;
            text-align: left;
        }
    </style>
</head>



<body class="full-lg">
<div id="wrapper">
<div id="main">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div style="margin-top: 122px;" class="account-wall">
                    <section class="align-lg-center">
                        <div class="site-logo"></div>
                        <br>
                                                
                    </section>
                    <form action="" method="POST" id="form-signin" class="form-horizontal form-signin" data-collabel="3" data-alignlabel="left"><section>
                        <div class="input-group">
                                <div class="input-group-addon"><i class="fa fa-user"></i></div>
                                <input class="form-control" id="username" name="username" placeholder="Nama" type="text">
                        </div>
                        <div class="input-group" style="margin-bottom: 0px;">
                                <div class="input-group-addon"><i class="fa fa-bolt"></i></div>
                                <select class="form-control" id="jenis-kelamin" name="jenis-kelamin">
							    	<option value="PRIA">Pria</option>
							    	<option value="WANITA">Wanita</option>
							  	</select>
                                <!-- <input class="form-control" id="jenis-kelamin" name="jenis-kelamin" placeholder="Jenis Kelamin" type="text"> -->
                        </div>
                        <div class="input-group" style="margin-bottom: 10px;">
                                <div class="input-group-addon"><i class="fa fa-clock-o"></i></div>
                                <input class="form-control" id="umur" name="umur" placeholder="Umur" type="text">
                        </div>
                        <button class="btn btn-lg btn-theme btn-block" type="submit" id="sign-in">Masuk</button>
                    </section>
                    <section class="clearfix">
                            <a href="?action=petunjuk" class="pull-right help">Petunjuk</a>
                    </section>
                    </form>
                </div>  
            </div>
        </div>
    </div>
    
</div>
        
</div>

<script type="text/javascript" src="assets/js/login/jquery.js"></script>
<script type="text/javascript" src="assets/js/login/jquery_003.js"></script>
<script type="text/javascript" src="assets/js/login/bootstrap.js"></script>
<script type="text/javascript" src="assets/js/login/modernizr.js"></script>
<script type="text/javascript" src="assets/js/login/jquery_002.js"></script>
<script type="text/javascript" src="assets/js/login/form.js"></script>
<script type="text/javascript" src="assets/js/login/datetime.js"></script>
<script type="text/javascript" src="assets/js/login/chart.js"></script>
<script type="text/javascript" src="assets/js/login/pluginsForBS.js"></script>
<script type="text/javascript" src="assets/js/login/miscellaneous.js"></script>
<script type="text/javascript" src="assets/js/login/custom.js"></script>
<script type="text/javascript">
    //<!--
        $(function() {
           //Login animation to center 
        function toCenter(){
            var mainH=$("#main").outerHeight();
            var accountH=$(".account-wall").outerHeight();
            var marginT=(mainH-accountH)/2;
                   if(marginT>30){
                       $(".account-wall").css("margin-top",marginT-15);
                    }else{
                        $(".account-wall").css("margin-top",30);
                    }
        }
        toCenter();
        var toResize;
        $(window).resize(function(e) {
            clearTimeout(toResize);
            toResize = setTimeout(toCenter(), 500);
        });
    });
    //-->
</script>
<div class="toggle-menu"></div>
</body>
</html>
<!-- HTML -->